var oimg = document.querySelectorAll(".oimg")[0]
var circle = document.querySelectorAll(".circle")
var baner_le_img = document.querySelectorAll(".baner_le_img")[0]

var oimgflag = 1
baner_le_img.onmouseover = function() {
    clearInterval(oimg.inter)
}
baner_le_img.onmouseleave = function() {
    fun()
}


circle[0].style.backgroundColor = "#fff"

function fun1() {
    oimg.style.opacity = 1
    clearInterval(oimg.inter2)
    oimg.inter2 = setInterval(function() {
        oimg.style.opacity = oimg.style.opacity - 0.1
        if (oimg.style.opacity == 0.8) {
            clearInterval(oimg.inter2)
            oimg.style.opacity = 1;
            if (oimgflag == 1) {
                oimg.src = "./images/shouye/banner-1.jpg"
                circle[0].style.backgroundColor = "#fff"
                circle[1].style.backgroundColor = ""
                circle[2].style.backgroundColor = ""
                circle[3].style.backgroundColor = ""
                circle[4].style.backgroundColor = ""
            } else if (oimgflag == 2) {
                oimg.src = "./images/shouye/banner-2.jpg"
                circle[1].style.backgroundColor = "#fff"
                circle[0].style.backgroundColor = ""
                circle[2].style.backgroundColor = ""
                circle[3].style.backgroundColor = ""
                circle[4].style.backgroundColor = ""
            } else if (oimgflag == 3) {
                oimg.src = "./images/shouye/banner-3.jpg"
                circle[2].style.backgroundColor = "#fff"
                circle[0].style.backgroundColor = ""
                circle[1].style.backgroundColor = ""
                circle[3].style.backgroundColor = ""
                circle[4].style.backgroundColor = ""
            } else if (oimgflag == 4) {
                oimg.src = "./images/shouye/banner-4.jpg"
                circle[3].style.backgroundColor = "#fff"
                circle[0].style.backgroundColor = ""
                circle[1].style.backgroundColor = ""
                circle[2].style.backgroundColor = ""
                circle[4].style.backgroundColor = ""
            } else if (oimgflag == 5) {
                oimg.src = "./images/shouye/banner-5.jpg"
                circle[4].style.backgroundColor = "#fff"
                circle[0].style.backgroundColor = ""
                circle[1].style.backgroundColor = ""
                circle[2].style.backgroundColor = ""
                circle[3].style.backgroundColor = ""
            }
        }
    }, 100)
}
fun();

function fun() {
    clearInterval(oimg.inter)
    oimg.inter = setInterval(function() {
        oimgflag++;
        if (oimgflag == 6) {
            oimgflag = 1;
        }
        fun1()
    }, 3000)
}
circle[0].onclick = function() {
    fun1()
    oimgflag = 1
}
circle[1].onclick = function() {
    fun1()
    oimgflag = 2
}
circle[2].onclick = function() {
    fun1()
    oimgflag = 3
}
circle[3].onclick = function() {
    fun1()
    oimgflag = 4
}
circle[4].onclick = function() {
    fun1()
    oimgflag = 5
}